<template>
  <div>
    <home-header></home-header>
    <home-swiper :imgList="imgList"></home-swiper>
    <home-icons :iconsList="iconsList"></home-icons>
    <home-recommend :recommendList="recommendList"></home-recommend>
    <home-weekend :weekendList="weekendList"></home-weekend>
  </div>
</template>
<script>
import HomeHeader from '@/pages/home/components/HomeHeader'
import HomeSwiper from '@/pages/home/components/HomeSwiper'
import HomeIcons from '@/pages/home/components/HomeIcons'
import HomeRecommend from '@/pages/home/components/Recommend'
import HomeWeekend from '@/pages/home/components/Weekend'
import axios from 'axios'
export default {
  name: 'Home',
  components: {
    HomeWeekend,
    HomeRecommend,
    HomeHeader,
    HomeSwiper,
    HomeIcons
  },
  data: function () {
    return {
      homeData: {},
      imgList: [],
      iconsList: [],
      recommendList: [],
      weekendList: []
    }
  },
  methods: {
    getHomeData () {
      var _this = this
      axios.get('/static/mock/home.json').then(function (response) {
        var homeData = response.data
        if (homeData.ret && homeData.data) {
          let sourceData = homeData.data
          _this.imgList = sourceData.swiperList
          _this.iconsList = sourceData.iconList
          _this.recommendList = sourceData.recommendList
          _this.weekendList = sourceData.weekendList
        }
      }).catch(function (error) {
        console.log(error)
      })
    }
  },
  mounted () {
    this.getHomeData()
  }
}
</script>
